
<template>
  <!-- 导航栏 -->
  <appNavbar />
  <!-- 头部类目 -->
  <appHeader />
  <!-- 吸顶头部 -->
  <AppHeaderSticky/>
  <!-- 二级路由 主体内容-->
  <RouterView class="app-body"></RouterView>
  <!-- 底部版权信息 -->
  <appFooter />
</template>

<script>
import appNavbar from '@/components/app-navbar.vue'
import appHeader from '@/components/app-header.vue'
import appFooter from '@/components/app-footer.vue'
import AppHeaderSticky from '@/components/app-header-sticky.vue'
import { useStore } from 'vuex'
import { computed } from 'vue'
export default {
  name: 'LayoutPage',
  components: {
    appNavbar,
    appHeader,
    appFooter,
    AppHeaderSticky
  },
  setup () {
    const store = useStore()

    const list = computed(() => {
      return store.dispatch('category/getList')
    })
    return { list }
  }

}
</script>
<style lang="less">
.app-body {
  min-height: 600px;
}
</style>
